<!DOCTYPE html>
<html>
	<head>
		<!-- 设置浏览器不缓存 -->
		<META HTTP-EQUIV="pragma" CONTENT="no-cache">
		<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
		<META HTTP-EQUIV="expires" CONTENT="0">
		<!-- Content-Type -->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<!-- Favicon -->
		<link rel="shortcut icon" href="./images/logo.png">
		<title>企业服务共享中心-优惠单</title>
		<!--stylesheets-->
		<link rel="stylesheet" href="./plugins/element/index.css">
		<script src="./plugins/vue/vue.js"></script>
		<script src="./plugins/element/index.js"></script>
		<script src="./plugins/vue/clipboard.js"></script>
		<script src="./plugins/axios/axios.min.js"></script>
		<script src="./js/common/public.js?v=0.8.0.3"></script>
		<!-- 自定义样式表 -->
		<link rel="stylesheet" href="./css/base.css?v=0.8.0.3">
	</head>
	<style type="text/css">
		.el-range-editor.el-input__inner {
			width: 200px;
		}

		.el-range-editor .el-range-input {
			width: 80px;
		}



		.el-form-item__datetimestyle .el-form-item__label {
			width: 50%;
		}


		.el-form-item__baseinfo .el-form-item__label {
			width: 50%;
		}

		.el-form-item__allbaseinfo .el-form-item__label {
			width: 100%;
		}
	</style>
	<body>
		<div id="app">
			<template>
				<el-container class="maincontainer">
					<el-container class="submaincontainer">
						<el-card class="box-card" style="position:relative;width:330px" shadow="never" v-show="leftbar_show">
							<div style="position:absolute;left:0;top:0;right:0;bottom:0;overflow-y:auto;overflow-x:hidden;padding-left: 20px;padding-top: 20px;padding-right: 20px;">
								<el-form :model="queryForm" ref="queryForm">
									<el-form-item label="申请人" prop="applicantId">
										<el-select v-model="queryForm.applicantId" filterable clearable>
											<el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id">
											</el-option>
										</el-select>
									</el-form-item>
									<el-form-item label="状态" prop="status">
									<el-select v-model="queryForm.status" filterable clearable>
										<el-option v-for="item in statusoptions" :key="item.value" :label="item.label" :value="item.value">
										</el-option>
									</el-select>
									</el-form-item>
									<el-form-item label="创建日期" prop="createTime">
										<el-date-picker v-model="queryForm.createTime" type="datetimerange" value-format="yyyy-MM-dd" :picker-options="pickerOptions"
										 range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" align="left">
										</el-date-picker>
									</el-form-item>
									<el-form-item>
										<el-button size="small" type="primary" @click.native.prevent="start">查询</el-button>
									</el-form-item>
								</el-form>
							</div>
						</el-card>




						<el-card class="box-card" style="width:100%" shadow="never">
							<div slot="header" class="clearfix">
								<i v-on:click="showLeftBar()" v-bind:class="[leftbar_show ? 'el-icon-s-fold' : 'el-icon-s-unfold']" style="color:#409EFF;cursor:pointer;"></i>
								<span>优惠单列表</span>
								<el-button-group style="float: right;margin-top:0px;">
									<el-tooltip v-for="item in toolbar" class="item" effect="dark" v-bind:content="item.content" placement="top-start">
										<el-button size="small" v-bind:icon="item.icon" v-bind:type="item.type" @click="toolAction(item.content)">{{item.content}}</el-button>
									</el-tooltip>
								</el-button-group>
							</div>
							<div>
								<el-table ref="multipleTable" @select='selectionChange' :data="pagedata" tooltip-effect="dark" :height="tableHeight"
								 border highlight-current-row style="width: 100%;" @selection-change="handleSelectionChange">
									<el-table-column type="selection" min-width="55">
									</el-table-column>



									<el-table-column type="expand">
										<template slot-scope="props">
											<el-form label-position="left" inline class="demo-table-expand">
												<el-table :data="props.row.recs"  stripe border >
													<!-- 	<div v-for="(item,index) in props.row.recs"> -->
													<el-table-column label="申请业务" prop="servicename"></el-table-column>
													<el-table-column label="规格" prop="spec"></el-table-column>
													<el-table-column label="类型" prop="type"></el-table-column>
													<el-table-column label="数量" prop="amount"></el-table-column>
													<el-table-column label="单位" prop="unit"></el-table-column>
													<el-table-column label="单价" prop="price"></el-table-column>
													<el-table-column label="优惠前金额" prop="priceb"></el-table-column>
													<el-table-column label="优惠后金额" prop="pricea"></el-table-column>
													<el-table-column label="备注" prop="remake"></el-table-column>
												</el-table>
											</el-form>
										</template>
									</el-table-column>


									<el-table-column v-for="column in tablecolums" v-bind:prop="column.prop" v-bind:label="column.label"
									 v-bind:min-width="column.width" show-overflow-tooltip>
									</el-table-column>
									<el-table-column label="操作" min-width="80">
										<template slot-scope="scope">
											<el-link type="primary" v-show="showAudit(scope.$index, scope.row)" @click="confirm(scope.$index, scope.row)">审核</el-link>
											<el-link type="primary" v-if="localStorage.getItem('ISLEADER')=='是' && scope.row.status != '已作废'" @click="remove(scope.$index, scope.row)">作废</el-link>
										</template>
									</el-table-column>

								</el-table>


								<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentPageChange" :current-page="queryForm.pageNo"
								 :page-sizes="queryForm.pagesizes" :page-size="queryForm.pagesize" background layout="total,sizes, prev, pager, next"
								 :total="pagetotal">
								</el-pagination>
							</div>
		</div>
		</el-card>
		</el-container>
		</el-container>




		<el-dialog :close-on-click-modal="false" title="优惠单信息" :visible.sync="dialogFormVisible" width="1000px">
			<el-form :model="discountForm" ref="discountForm" :rules="discountFormRules" label-width="130px" :disabled='dialogDisabled'>
				<el-tabs :value="tabvalue">
					<el-tab-pane label="基础信息" name="base">
						<el-row :gutter="20">
							<el-col :span="12">
								<el-form-item label="客户名称" prop="customerId">
									<el-select v-model="discountForm.customerId" filterable>
										<el-option v-for="item in companys" :key="item.id" :label="item.customername" :value="item.customerId">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="优惠类型" prop="type">
									<el-select v-model="discountForm.type" filterable>
										<el-option v-for="item in types" :key="item" :label="item" :value="item">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="24">
								<el-form-item label="优惠描述" prop="preferentialDescription">
									<el-input v-model="discountForm.preferentialDescription" type="textarea"></el-input>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="8">
								<el-form-item label="申请人" prop="applicantId">
									<el-select v-model="discountForm.applicantId" filterable>
										<el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="8">
									<el-form-item label="主管" prop="leaderId">
									<el-select v-model="discountForm.leaderId" filterable>
										<el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="经理" prop="managerId">
									<el-select v-model="discountForm.managerId" filterable>
										<el-option v-for="item in users" :key="item.id" :label="item.name" :value="item.id">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
						</el-row>

					</el-tab-pane>
					<el-tab-pane label="申请业务" name="business">
						<el-row :gutter="5">
							<el-col :span="2" :offset="22">
								<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="addService()">添加</el-button>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="24">
								<el-table border :data="serviceForm.service" ref="multipleTable" tooltip-effect="dark" size="mini" height="200"
								 style="width: 100%;">
									<el-table-column v-for="column in servicescolums" v-bind:prop="column.prop" v-bind:label="column.label"
									 v-bind:min-width="column.width" show-overflow-tooltip>
									</el-table-column>
									<el-table-column label="操作" min-width="50">
										<template slot-scope="scope">
											<el-tooltip class="item" effect="dark" content="编辑" placement="top-start">
												<el-link type="primary" icon="el-icon-edit" @click="editService(scope.$index, scope.row)"></el-link>
											</el-tooltip>
											<el-tooltip class="item" effect="dark" content="删除" placement="top-start">
												<el-link type="danger" icon="el-icon-delete" @click="delService(scope.$index, scope.row)"></el-link>
											</el-tooltip>
										</template>
									</el-table-column>
								</el-table>
							</el-col>
						</el-row>
					</el-tab-pane>
				</el-tabs>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogFormVisible = false">取 消</el-button>
				<el-button type="primary" @click="applyconfirm" v-show="action!='edit'">确 定</el-button>
			</div>
		</el-dialog>

		<el-dialog :close-on-click-modal="false" title="服务信息" :visible.sync="dialogserviceFormDetailVisible" width="1000px">
			<el-form :model="serviceFormDetail" :rules="serviceFormDetailRules" ref="serviceFormDetail" label-width="120px">
				<el-row :gutter="20">
					<el-col :span="8">
						<el-form-item label="服务名称" prop="name">
							<el-select v-model="serviceFormDetail.name" filterable @change="servicechange">
								<el-option v-for="item in services" :key="item.id" :label="item.name" :value="item.id">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="规格" prop="spec">
							<span>{{serviceFormDetail.spec}}</span>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="类别" prop="type">
							<span>{{serviceFormDetail.type}}</span>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="20">
					<el-col :span="8">
						<el-form-item label="数量" prop="amount">
							<el-input v-model="serviceFormDetail.amount"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="单位" prop="unit">
						<span>{{serviceFormDetail.unit}}</span>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="单价" prop="price">
						<span>{{serviceFormDetail.price}}</span>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="20">
					<el-col :span="8">
						<el-form-item label="优惠前金额" prop="priceb">
							<el-input v-model="serviceFormDetail.priceb"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="优惠后金额" prop="pricea" >
							<el-input v-model="serviceFormDetail.pricea" ></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="备注" prop="memo">
							<el-input v-model="serviceFormDetail.memo"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="20">
					<el-col :span="24">
						<el-table border :data="serviceFormDetail.service" ref="serviceFormDetailTable" tooltip-effect="dark" size="mini"
						 height="200" @row-click="serviceDetailClick" style="width: 100%;">
							<el-table-column v-for="column in detailcolums" v-bind:prop="column.prop" v-bind:label="column.label"
							 v-bind:min-width="column.width" show-overflow-tooltip>
							</el-table-column>
						</el-table>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogserviceFormDetailVisible = false">取 消</el-button>
				<el-button type="primary" @click="confirmService" :disabled="submitDisable">确 定</el-button>
			</div>
		</el-dialog>








		</template>
		</div>
	</body>

	<script src="./js/discount_list.js"></script>

	</script>
</html>
